<template>
  <div class="app-container">
    <el-form ref="form" :model="form">
      <el-form-item label="路径">
        <el-select multiple v-model="ml" filterable placeholder="请选择">
          <el-option
            v-for="item in mlLs"
            :key="item.ID"
            :label="item.名称"
            :value="item.ID"
          >
          </el-option>
        </el-select>
      </el-form-item>

      <el-form-item label="版本">
        <el-select v-model="form.版本" placeholder="版本">
          <el-option
            v-for="item in [
              { label: '内科', value: '1' },
              { label: '操作', value: '2' },
              { label: '外科', value: '3' },
            ]"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          >
          </el-option>
        </el-select>
      </el-form-item>

      <el-form-item label="列数">
        <el-select v-model="form.rsize" placeholder="列数">
          <el-option
            v-for="item in [
              { label: '2', value: '2' },
              { label: '3', value: '3' },
              { label: '4', value: '4' },
            ]"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          >
          </el-option>
        </el-select>
      </el-form-item>

      <el-form-item label="入院日诊疗">
        <el-input
          type="textarea"
          :rows="5"
          v-model="form.inadmision10"
        ></el-input>
      </el-form-item>

      <el-form-item label="入院日护理">
        <el-input
          type="textarea"
          :rows="5"
          v-model="form.inadmision11"
        ></el-input>
      </el-form-item>

      <el-form-item label="住院期间1诊疗（手术前1）">
        <el-input
          type="textarea"
          :rows="5"
          v-model="form.inhospital10"
        ></el-input>
      </el-form-item>

      <el-form-item label="住院期间1护理（手术前1）">
        <el-input
          type="textarea"
          :rows="5"
          v-model="form.inhospital11"
        ></el-input>
      </el-form-item>

      <el-form-item label="住院期间2诊疗（手术前2）">
        <el-input
          type="textarea"
          :rows="5"
          v-model="form.inhospital20"
        ></el-input>
      </el-form-item>

      <el-form-item label="住院期间2护理（手术前2）">
        <el-input
          type="textarea"
          :rows="5"
          v-model="form.inhospital21"
        ></el-input>
      </el-form-item>

      <el-form-item label="住院期间3诊疗（手术日）">
        <el-input
          type="textarea"
          :rows="5"
          v-model="form.inhospital30"
        ></el-input>
      </el-form-item>

      <el-form-item label="住院期间3护理（手术日）">
        <el-input
          type="textarea"
          :rows="5"
          v-model="form.inhospital31"
        ></el-input>
      </el-form-item>

      <el-form-item label="住院期间4诊疗（术后1）">
        <el-input
          type="textarea"
          :rows="5"
          v-model="form.inhospital40"
        ></el-input>
      </el-form-item>

      <el-form-item label="住院期间4护理（术后1）">
        <el-input
          type="textarea"
          :rows="5"
          v-model="form.inhospital41"
        ></el-input>
      </el-form-item>

      <el-form-item label="住院期间5诊疗（术后2）">
        <el-input
          type="textarea"
          :rows="5"
          v-model="form.inhospital50"
        ></el-input>
      </el-form-item>

      <el-form-item label="住院期间5护理（术后2）">
        <el-input
          type="textarea"
          :rows="5"
          v-model="form.inhospital51"
        ></el-input>
      </el-form-item>

      <el-form-item label="出院前诊疗">
        <el-input
          type="textarea"
          :rows="5"
          v-model="form.beforeadmision10"
        ></el-input>
      </el-form-item>

      <el-form-item label="出院前护理">
        <el-input
          type="textarea"
          :rows="5"
          v-model="form.beforeadmision11"
        ></el-input>
      </el-form-item>

      <el-form-item label="出院日诊疗">
        <el-input
          type="textarea"
          :rows="5"
          v-model="form.outadmision10"
        ></el-input>
      </el-form-item>

      <el-form-item label="出院日护理">
        <el-input
          type="textarea"
          :rows="5"
          v-model="form.outadmision11"
        ></el-input>
      </el-form-item>

      <el-form-item label="备注">
        <el-input type="textarea" :rows="5" v-model="form.mark"></el-input>
      </el-form-item>

      <el-form-item>
        <el-button type="primary" @click="onSubmit">提交</el-button>
        <el-button @click="go">取消</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>

<script lang="ts">
import { Component, Vue } from "vue-property-decorator";

import { tplFormId, lcljml, tplForm } from "@/api/pathway";
@Component({
  name: "ed-tpl-form",
})
export default class extends Vue {
  private created() {
    this.formId();
    this.lcljmlLs();
  }

  private ml: Array<any> = [];

  private mlLs: Array<any> = [];
  private async lcljmlLs() {
    let d = await lcljml({});
    this.mlLs = d.data;
  }
  private form: any = {};
  private async formId() {
    if (!this.$route.query.id) return;

    let d: any = await tplFormId({ id: this.$route.query.id });
    this.form = d.data;
    //console.log(parseInt(d.路径ID));

    if (d.data.路径ID) {
      this.ml.push(...d.data.路径ID.split(",").map((it: any) => parseInt(it)));
    }
  }

  private async onSubmit() {
    const loading = this.$loading({
      text: `正在提交....`,
      lock: true,
      background: "rgba(255, 255, 255, 0.1)",
    });

    if (this.ml) {
      this.form.路径ID = this.ml.join(",");
      this.form.m = this.mlLs
        .filter((it: any) => this.ml.includes(it.ID))
        .map((it: any) => it.名称)
        .join(" ");
    }
    let d = await tplForm(this.form);

    setTimeout(() => {
      loading.close();
      this.go();
    }, 500);
  }

  private go() {
    this.$router.go(-1);
  }
}
</script>